<template>
  <div>
    <NuxtLayout name="courent">
      <div class="flex">
        <NuxtLink to="/welcome">
          <el-button type="primary">welcome</el-button>
        </NuxtLink>
      </div>
      <!-- <UDivider label="OR" /> -->
      <div>
        <NuxtLink to="/default">
          <el-button style="margin-top: 7px" type="primary">default</el-button>
        </NuxtLink>
      </div>
      <!-- <UDivider label="OR" /> -->
      <ClientOnly>
        <div class="w-96 h-96">
          <EchartLineChart />
        </div>
      </ClientOnly>
      <!-- <UDivider label="OR" /> -->
      <el-row :gutter="12">
        <transition-group
          appear
          name="animate__animated animate__bounc"
          enter-active-class="animate__flipInX"
          leave-active-class="animate__flipOutX"
        >
          <el-col style="margin: 10px 0" :span="4" v-for="(item, index) in liveList" :key="item.id">
            <el-card style="max-width: 480px; height: 100%">
              <template #header>{{ item.title }}</template>
              <img :src="item.cover" style="width: 100%" />
              <template #footer>{{ item.notice }}</template>
            </el-card>
          </el-col>
        </transition-group>
      </el-row>
    </NuxtLayout>
  </div>
</template>

<script setup lang="ts">
const Dayjs = useDayjs();
const runtimeConfig = useRuntimeConfig();
const liveList = ref([]);
const list1 = ref<any[]>([{ id: 0 }, { id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }]);
let params = {
  page: 1,
  pageSize: 12,
  // roleType: 2,
  isHost: 1,
};
// if (list.value.length > 0) {
//   console.log(123123)
// }
// else {
//   console.log(333)
// }
// const getData = () => {
//   hello(params).then((res) => {
//     console.log('2222222222',res)
//     liveList.value = liveList.value.concat(res.data.list);
//     params.page++;
//   });
// };
if (import.meta.server) {
  console.log('server');
}
 getTags(params).then((res)=>{
  console.log(res,'res')
})
// hello(params).then((res) => {
//   console.log(res,'res1')
// })
// const list= useAsyncData('list',async()=>{ await getTags(params)})
// const list =  useAsyncData('list',async ()=>{
//   console.log('22222222')
//  return await hello(params)
// })
// getTags(params).then((res) => {
//   console.log(res);
// });

// console.log(list.status.value,'21')

// console.log(list,'1')
// liveList.value = liveList.value.concat(list.data.list);
// console.log(list,'2')
// getData()
</script>

<style lang="scss" scoped>
.ui-grid {
  @apply grid;
}
</style>
